﻿<%@ Page Title="" Language="C#" MasterPageFile="~/UI/Main.Master" AutoEventWireup="true" CodeBehind="nguoidung.aspx.cs" Inherits="QLBH.UI.nguoidung" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <style type="text/css">
        
        .popover {
            width: 276px;
        }

        .popover-title {
            padding: 0px;
        }

        .popover-content {
           
            overflow: auto;
        }

        table th {
            font-size: 16px;
        }

        #table_quyen th {
            font-size: inherit;
        }

        table tr td {
            text-align: left;
        }
    </style>


    <div class="row">
        <div class="col-md-4">
        </div>
        <div class="col-md-4 text-right" style="padding-bottom: 5px;">
            <span id="btn_role" data-toggle="popover" class="btn btn-success"><span class="glyphicon glyphicon-exclamation-sign"></span></span>
            <span id="btn_refresh" class="btn btn-success"><span class="glyphicon glyphicon-refresh"></span></span>
            <span id="btn_add" data-toggle="popover" class="btn btn-primary">&nbsp<span class="glyphicon glyphicon-plus"></span></span>
            <span id="btn_edit" data-toggle="popover" class="btn btn-primary"><span class="glyphicon glyphicon-pencil"></span></span>
            <span id="btn_delete" data-toggle="popover" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span></span>

        </div>
        <div class="col-md-4 text-right">
            <div class="form-group">
                <input type="search" class="form-control" id="txt_search" placeholder="Nhập vào tên đăng nhập" />
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12 text-center" id="lazyScroll" style="overflow: auto;">

            <table id="table_nguoidung" class="table table-bordered " style="min-width: 500px;">
                <thead>
                    <tr>
                        <th class="text-center" style="width: 30px;">
                            <input id="chk_check_all" type="checkbox" value="-1" />
                        </th>
                        <th class="text-center" style="width: 50px;">STT</th>
                        <th style="width: 100px;">Mã Số</th>
                        <th>Mã nhân viên</th>
                        <th>Tên đăng nhập</th>
                    </tr>
                </thead>
                <tbody>
                    <%-- <tr>
                        <td>
                            <input type="checkbox" value="" />
                        </td>
                        <td>1</td>
                        <td>Mark</td>
                        <td>Otto</td>
                        <td>@mdo</td>
                    </tr>--%>
                </tbody>
            </table>
        </div>
    </div>

    <div id="popoverPhanquyen" style="display: none; overflow: auto;">

        <select class="form-control" id="cbo_chuc_nang">
        </select>

        <table id="table_quyen" class="table table-bordered">
            <thead>
                <tr>
                    <th class="text-center">Xem</th>
                    <th class="text-center">Thêm</th>
                    <th class="text-center">Sửa</th>
                    <th class="text-center">Xóa</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="text-center">
                        <input type="checkbox" id="chk_view" value="8" />
                    </td>
                    <td class="text-center">
                        <input type="checkbox" id="chk_addnew" value="1" />
                    </td>
                    <td class="text-center">
                        <input type="checkbox" id="chk_edit" value="2" />
                    </td>
                    <td class="text-center">
                        <input type="checkbox" id="chk_delete" value="4" />
                    </td>
                </tr>

            </tbody>
        </table>
        <%--<button id="btn_luu_quyen" type="submit" class="btn btn-primary pull-left">&nbsp&nbsp Lưu &nbsp&nbsp  </button>--%>
    </div>

    <div id="popoverExampleTwoHiddenContent" style="display: none">

        <form role="form" id="nguoidung_form">
            <div class="form-group">
                <label for="txt_ma_nd">Mã người dùng</label>
                <input type="text" class="form-control" name="txt_ma_nd" id="txt_ma_nd" placeholder="Mã người dùng" />
            </div>

            <div class="form-group">
                <label for="txt_ma_nv">Mã nhân viên</label>
                <input type="text" class="form-control" name="txt_ma_nv" id="txt_ma_nv" placeholder="Mã nhân viên" />
            </div>

            <div class="form-group">
                <label for="txt_ten_dn">Tên đăng nhập</label>
                <input type="text" class="form-control" name="txt_ten_dn" id="txt_ten_dn" placeholder="Tên đăng nhập" />
            </div>
            <button id="btn_save" type="submit" class="btn btn-primary pull-right">&nbsp&nbsp Lưu &nbsp&nbsp  </button>
        </form>

    </div>


    <!-- Popover 2 hidden title -->
    <div id="popoverExampleTwoHiddenTitle" style="display: none;">
        <h4 class="text-center">Cập nhật người dùng</h4>
    </div>
    <div id="popoverphanquyentitle" style="display: none;">
        <h4 class="text-center">Phân quyền người dùng</h4>
    </div>


    <script src="slidebars/scripts/bootstrap/js/jquery.min.js"></script>
    <script src="slidebars/scripts/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript">
       
        $(document).ready(function () {

           
            $("#lazyScroll").scroll(function () {
                if ($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
                   
                    var tables = document.getElementById("table_nguoidung");
                    //if (tables.row.length-1 % 20 != 0) {
                    //    return;
                    //}
                    BlockUI();
                    var search_term = $("#txt_search").val();
                    TimNguoiDung(search_term, tables.rows.length - 1);
                }
            });


            function Kiemtrahople() {
                if ($('#txt_ma_nv').val().length <= 0) {
                    $('#txt_ma_nv').focus();
                    $('#txt_ma_nv').tooltip({ placement: 'top', title: 'Bạn cần nhập mã nhân viên' });
                    return false;
                }

                if ($('#txt_ten_dn').val().length <= 0) {
                    $('#txt_ten_dn').focus();
                    $('#txt_ten_dn').tooltip({ placement: 'top', title: 'Bạn cần nhập tên đăng nhập' });
                    return false;
                }

                return true;
            }

            function XoaText() {
                $('#txt_ma_nv').val('');
                $('#txt_ten_dn').val('');
                $('#txt_ma_nd').val('');
            }

            function BlockUI() {
                $.blockUI({
                    message: "<img src='images/ajax-loader.gif'/>", css: { left: '50%', cursor: 'wait', backgroundColor: 'none', border: 'none', width: '50px' },
                    overlayCSS: { backgroundColor: 'none', opacity: 0.0, cursor: 'wait' }
                });
            }

            function BlockUIPopover() {
                $('.popover').block({
                    message: "<img src='images/ajax-loader.gif'/>", css: { left: '50%', cursor: 'wait', backgroundColor: 'none', border: 'none', width: '50px' },
                    overlayCSS: { backgroundColor: 'none', opacity: 0.0, cursor: 'wait' }
                });
            }

            function TimNguoiDung(ten_dang_nhap, tong_so_dong) {

                var DTO = {
                    'ten_dang_nhap': ten_dang_nhap,
                    'tong_so_dong': tong_so_dong
                };

                $.ajax({
                    type: "POST",
                    url: "../BUSINESS/Services.asmx/TimNguoiDungTheoTen",
                    data: JSON.stringify(DTO),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {

                        $.each($.parseJSON(data.d), function (idx, obj) {
                            tong_so_dong += 1;
                            $("#table_nguoidung tbody").append(
                            '<tr>' +
                            ' <td>' +
                            ' <input type="checkbox" value="' + tong_so_dong + '" />' +
                            ' </td>' +
                            ' <td>' + tong_so_dong + '</td>' +
                            ' <td>' + obj.MA_NGUOI_DUNG + '</td>' +
                            ' <td>' + obj.MA_NHAN_VIEN + '</td>' +
                            ' <td>' + obj.TEN_DANG_NHAP + '</td>' +
                            ' </tr>');
                        });

                    },
                    error: function (data) {
                        console.log(data.d);
                    }

                });
            }

            function TimChucNang(ten_chuc_nang) {

                BlockUIPopover();
                var DTO = {
                    'ten_chuc_nang': ten_chuc_nang
                };

                $.ajax({
                    type: "POST",
                    url: "../BUSINESS/Services.asmx/TimChucNangTheoTen",
                    data: JSON.stringify(DTO),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $(".popover").unblock();
                        var html = "";
                        $.each($.parseJSON(data.d), function (idx, obj) {
                            html += '<option value="' + obj.MA_CHUC_NANG + '">' + obj.TEN_CHUC_NANG + '</option>';
                        });
                        $("#cbo_chuc_nang").html(html);

                    },
                    error: function (data) {
                        $(".popover").unblock();
                        console.log(data.d);
                    }

                });
            }

            function TimQuyen(ma_nguoi_dung, ma_chuc_nang) {

                BlockUIPopover();
                var DTO = {
                    'ma_nguoi_dung': ma_nguoi_dung,
                    'ma_chuc_nang': ma_chuc_nang
                };

                $.ajax({
                    type: "POST",
                    url: "../BUSINESS/Services.asmx/LayQuyenTheoMaND",
                    data: JSON.stringify(DTO),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $(".popover").unblock();
                        var obj = $.parseJSON(data.d)
                        var OK = false;
                        if ((obj.SO_QUYEN & 2) == 2) {
                            OK = true;
                            $("#chk_edit").prop('checked', 'checked');
                        }

                        if ((obj.SO_QUYEN & 4) == 4) {
                            OK = true;
                            $("#chk_delete").prop('checked', 'checked');
                        }

                        if ((obj.SO_QUYEN & 8) == 8) {
                            OK = true;
                            $("#chk_view").prop('checked', 'checked');
                        }

                        if ((obj.SO_QUYEN & 1) == 1) {
                            OK = true;
                            $("#chk_addnew").prop('checked', 'checked');
                        }

                        if (!OK) {
                            $("#chk_edit").prop('checked', '');
                            $("#chk_delete").prop('checked', '');
                            $("#chk_view").prop('checked', '');
                            $("#chk_addnew").prop('checked', '');
                        }
                    },
                    error: function (data) {
                        $(".popover").unblock();
                        console.log(data.d);
                    }

                });
            }

                function CapNhatQuyen(ma_nguoi_dung, ma_chuc_nang,so_quyen) {

                    BlockUIPopover();
                    var DTO = {
                        'ma_nguoi_dung': ma_nguoi_dung,
                        'ma_chuc_nang': ma_chuc_nang,
                        'so_quyen': so_quyen
                    };

                    $.ajax({
                        type: "POST",
                        url: "../BUSINESS/Services.asmx/CapNhatQuyen",
                        data: JSON.stringify(DTO),
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (data) {
                            $(".popover").unblock();
                        },
                        error: function (data) {
                            $(".popover").unblock();
                            console.log('error');
                        }

                    });
                }

            onload = function () {
                BlockUI();
                var tables = document.getElementById("table_nguoidung");
                TimNguoiDung('', tables.rows.length - 1);
            }

            function Themoinguoidung() {
                if (!Kiemtrahople()) {
                    return false;
                }
                BlockUIPopover();
                var nguoi_dung = {};
                nguoi_dung.MA_NGUOI_DUNG = $('#txt_ma_nd').val();
                nguoi_dung.MA_NHAN_VIEN = $('#txt_ma_nv').val();
                nguoi_dung.TEN_DANG_NHAP = $('#txt_ten_dn').val();
                nguoi_dung.MAT_KHAU = '';

                var DTO = {
                    'nguoi_dung': nguoi_dung
                };
                $.ajax({
                    type: "POST",
                    url: "../BUSINESS/Services.asmx/ThemMoiNguoiDung",
                    data: JSON.stringify(DTO),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $(".popover").unblock();
                        var obj = jQuery.parseJSON(data.d);
                        if (obj.SUCCESS == -1) {
                            MakeToast('danger', 'Lỗi', obj.ERROR);
                        }
                        else {
                            MakeToast('success', 'Thành công', obj.ERROR);
                            XoaText();
                            $("#table_nguoidung tbody").html('');
                            var tables = document.getElementById("table_nguoidung");
                            var search_term = $("#txt_search").val();
                            TimNguoiDung(search_term, tables.rows.length - 1);
                        }

                    },
                    error: function (data) {
                        $(".popover").unblock();
                    }

                });
            }

            function Capnhatnguoidung() {
                if (!Kiemtrahople()) {
                    return false;
                }
                BlockUIPopover();
                var nguoi_dung = {};
                nguoi_dung.MA_NGUOI_DUNG = $('#txt_ma_nd').val();
                nguoi_dung.MA_NHAN_VIEN = $('#txt_ma_nv').val();
                nguoi_dung.TEN_DANG_NHAP = $('#txt_ten_dn').val();
                nguoi_dung.MAT_KHAU = '';

                var DTO = {
                    'nguoi_dung': nguoi_dung
                };
                $.ajax({
                    type: "POST",
                    url: "../BUSINESS/Services.asmx/CapNhatNguoiDung",
                    data: JSON.stringify(DTO),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $(".popover").unblock();
                        var obj = jQuery.parseJSON(data.d);
                        if (obj.SUCCESS == -1) {
                            MakeToast('danger', 'Lỗi', obj.ERROR);
                        }
                        else {
                            MakeToast('success', 'Thành công', obj.ERROR);
                            $("#table_nguoidung tbody").html('');
                            var tables = document.getElementById("table_nguoidung");
                            var search_term = $("#txt_search").val();
                            TimNguoiDung(search_term, tables.rows.length - 1);
                        }

                    },
                    error: function (data) {
                        $(".popover").unblock();
                    }

                });
            }

            function Xoanguoidung() {

                BlockUIPopover();
                var ma_nguoi_dung = [];

                var tables = document.getElementById("table_nguoidung");
                var k = -1;
                for (var i = 1; i < tables.rows.length; i++) {
                    var row = tables.rows[i]
                    if (row.className == 'info') {
                        k++;
                        ma_nguoi_dung[k] = row.cells[2].innerHTML;
                    }
                }

                var DTO = {
                    'ma_nguoi_dung': ma_nguoi_dung
                };
                $.ajax({
                    type: "POST",
                    url: "../BUSINESS/Services.asmx/XoaNguoiDung",
                    data: JSON.stringify(DTO),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $(".popover").unblock();
                        var obj = jQuery.parseJSON(data.d);
                        if (obj.SUCCESS == -1) {
                            MakeToast('danger', 'Lỗi', obj.ERROR);
                        }
                        else {
                            MakeToast('success', 'Thành công', obj.ERROR);
                            $("#btn_delete").popover('hide');
                            $("#table_nguoidung tbody").html('');
                            var tables = document.getElementById("table_nguoidung");
                            var search_term = $("#txt_search").val();
                            TimNguoiDung(search_term, tables.rows.length - 1);
                        }


                    },
                    error: function (data) {
                        $(".popover").unblock();
                    }

                });
            }

            function TinhSoQuyen() {
                var so_quyen = 0;
                if ($("#chk_edit").is(':checked')) {
                    so_quyen += 2;
                }

                if ($("#chk_delete").is(':checked')) {
                    so_quyen += 4;
                }

                if ($("#chk_view").is(':checked')) {
                    so_quyen += 8;
                }

                if ($("#chk_addnew").is(':checked')) {
                    so_quyen += 1;
                }
                return so_quyen;
            }

            $('body').on('click', 'span#btn_ok', function (event) {
                event.preventDefault();
                Xoanguoidung();
            });


            $('body').on('click', 'button#btn_save', function (event) {
                event.preventDefault();
                if ($('#txt_ma_nd').is(':disabled')) {
                    Capnhatnguoidung();
                }
                else
                    Themoinguoidung();
            });

            $('body').on('click', '#table_quyen :checkbox', function (event) {
                var tables = document.getElementById("table_nguoidung");
                CapNhatQuyen(tables.rows[CheckTableNguoidung()].cells[2].innerHTML, $("#cbo_chuc_nang option:selected").val(),TinhSoQuyen());
            });

            $('body').on('change', '#cbo_chuc_nang', function (event) {
                var tables = document.getElementById("table_nguoidung");
                TimQuyen(tables.rows[CheckTableNguoidung()].cells[2].innerHTML, $("#cbo_chuc_nang option:selected").val());
            });


            $("#btn_add").click(function (event) {
                event.preventDefault();
            });

            function CheckTableNguoidung() {
                var tables = document.getElementById("table_nguoidung");
                var k = -1;
                for (var i = 0; i < tables.rows.length; i++) {
                    var row = tables.rows[i]
                    if (row.className == 'info') {
                        k = i;
                        break;
                    }
                }
                return k;
            }

            $("#btn_edit").click(function (event) {
                event.preventDefault();
                var k = CheckTableNguoidung();
                if (k != -1) {
                    $(this).popover('show');
                }
            });

            $("#btn_role").click(function (event) {
                event.preventDefault();
                var k = CheckTableNguoidung();
                if (k != -1) {
                    $(this).popover('show');
                }

            });

            $("#btn_delete").click(function (event) {
                event.preventDefault();
                var tables = document.getElementById("table_nguoidung");
                var k = CheckTableNguoidung();
                if (k != -1) {
                    $(this).popover('show');
                }
            });

            $("#btn_refresh").click(function (event) {
                event.preventDefault();
                BlockUI();
                $("#table_nguoidung tbody").html('');
                var tables = document.getElementById("table_nguoidung");
                var search_term = $("#txt_search").val();
                TimNguoiDung('', tables.rows.length - 1);
            });


            var table = document.getElementById("table_nguoidung");

            $("table").on("click", ":checkbox", function () {
                if ($(this).val() == -1) {
                    if ($(this).is(':checked')) {
                        $("table tr").addClass("info");
                        $("table tr:first").removeClass("info");
                    }
                    else
                        $("table tr").removeClass("info");
                    return;
                }

                if ($(this).is(':checked')) {
                    $(this).parents("tr:first").addClass("info");
                }
                else {
                    $(this).parents("tr:first").removeClass("info");
                }
            });

            $("#chk_check_all").change(function () {

                if (this.checked) {
                    var table = document.getElementById("table_nguoidung");
                    $('td input:checkbox', table).prop('checked', this.checked);
                }
                else {
                    var table = document.getElementById("table_nguoidung");
                    $('td input:checkbox', table).prop('checked', '');
                }
            });

            $("#txt_search").keyup(function (e) {
                if (e.keyCode == 13) {
                    e.preventDefault();
                    e.stopPropagation();
                    var search_term = $("#txt_search").val();
                    if (search_term != '') {
                        BlockUI();
                        $("#table_nguoidung tbody").html('');
                        var tables = document.getElementById("table_nguoidung");
                        var search_term = $("#txt_search").val();
                        TimNguoiDung(search_term, tables.rows.length - 1);
                    }
                }

            });

            $("#btn_add").popover({
                html: true,
                content: function () {
                    return $('#popoverExampleTwoHiddenContent').html();
                },
                title: function () {
                    return $('#popoverExampleTwoHiddenTitle').html();
                },
                placement: 'bottom'

            });

            $("#btn_edit").popover({
                html: true,
                content: function () {
                    return $('#popoverExampleTwoHiddenContent').html();
                },
                title: function () {
                    return $('#popoverExampleTwoHiddenTitle').html();
                },
                placement: 'bottom',
                trigger: 'Click'

            });

            $("#btn_delete").popover({
                html: true,
                content: function () {

                    return $('#popoverConfirm').html();
                },
                title: function () {
                    return '<h4 class="text-center">Xác nhận xóa</h4>';
                },
                placement: 'bottom',
                trigger: 'Click'

            });

            $("#btn_role").popover({
                html: true,
                content: function () {
                    return $('#popoverPhanquyen').html();
                },
                title: function () {
                    return $('#popoverphanquyentitle').html();
                },
                placement: 'bottom',
                trigger: 'Click'

            });


            $('#btn_edit').on('shown.bs.popover', function () {
                var tables = document.getElementById("table_nguoidung");
                var k = -1;
                for (var i = 0; i < tables.rows.length; i++) {
                    var row = tables.rows[i]
                    if (row.className == 'info') {
                        $('#txt_ma_nd').attr("disabled", "disabled")
                        $('#txt_ma_nd').val(row.cells[2].innerHTML);
                        $('#txt_ma_nv').val(row.cells[3].innerHTML);
                        $('#txt_ten_dn').val(row.cells[4].innerHTML);
                        k = i;
                        break;
                    }
                }
            });

            $('#btn_delete').on('shown.bs.popover', function () {
                var tables = document.getElementById("table_nguoidung");
                var k = 0;
                for (var i = 0; i < tables.rows.length; i++) {
                    var row = tables.rows[i]
                    if (row.className == 'info') {
                        k++;
                    }
                }
                if (k != 0) {
                    $("#msgcontent").html('Bạn có chắc muốn xóa <strong>' + k + '</strong> người dùng ?');
                }
            });

            $('#btn_role').on('shown.bs.popover', function () {
                TimChucNang('');
            });
        });

    </script>
</asp:Content>
